<template>
	<div class="favorite" @click="tiaozhuan">
		<!-- <div class="favorite"> -->
			<div class="favorite_one">
				<img src="http://img1.qunarzz.com/piao/fusion/1711/89/ebc329f16c55bb02.png" alt="">
				<span>猜你喜欢</span>
			</div>
			<router-link :to="'/Detailss/'+item.id" tag="div" class="detailsTR" v-for="(item,index) in list" :key="item.index">
				<div class="leftimg">
					<img class="details_img" :src="item.img" alt="">
					<div class="leftimg2" v-if="">
						<img :src="item.leftimg" alt="">
						<span>{{item.leftText}}</span>
					</div>
				</div>
				<div class="detailRight">
					<span class="details_span">{{item.name}}</span>
					<div class="details_pinglun">
						<img :src="item.xingxing">
						<span>{{item.pinglun}}</span>
					</div>
					<div class="details_addres">
						<div>
							<span class="details_price">{{item.price}}</span>
							<span>{{item.price2}}</span>
						</div>
						<span>{{item.address}}</span>
					</div>
				</div>
			</router-link>
		</div>
	<!-- </div> -->
</template>

<script>
	export default {
		name: 'Favorite',
		data() {
			return {
				info: null,

			};
		},
		methods: {
			tiaozhuan() {
				this.$router.push('DetailsLy')
			}
		},
		props: {
			list: {
				type: Array,
			}
		}
	}
</script>

<style scoped>
	.favorite {
		width: 100%;
		margin-top: .1rem;
		background: white;
		box-sizing: border-box;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		flex-wrap: wrap;
	}

	.favorite_one {
		width: 100%;
		height: .4rem;
		line-height: .4rem;
		margin-left: .1rem;
		box-sizing: border-box;
	}

	.favorite_one img {
		width: .15rem;
		height: .15rem;
	}

	.detailsTR {
		width: 100%;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.details_img {
		width: 1rem;
		height: 1rem;
		margin-left: .1rem;
		box-sizing: border-box;
	}

	.detailRight {
		width: 2.5rem;
		height: 1.3rem;
		display: flex;
		flex-flow: column;
		justify-content: space-around;
		align-items: flex-start;
		margin-left: .1rem;
		box-sizing: border-box;

	}

	/* 小图标 */
	.leftimg {
		position: relative;

	}

	.leftimg2 img {
		width: .51rem;
		height: .19rem;
		position: absolute;
		left: .1rem;
		top: 0;
	}

	.leftimg2 span {
		font-size: .1rem;
		position: absolute;
		left: .12rem;
		top: 0;
		color: white;
	}

	.details_span {
		font-size: .16rem;
	}

	.details_pinglun span {
		font-size: .12rem;
	}

	.details_price {
		color: #ff8300;
		font-size: .2rem;
	}

	.details_addres {
		width: 2.5rem;
		color: #616161;
		font-size: .12rem;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.details_bottom span {
		font-size: .13rem;
	}

	.details_conts {
		font-size: .12rem;
		color: #f55;
		margin-left: 1.1rem;
	}
</style>
